<template>
  <div class="app-container">
    <div class="search-container">
      <el-form v-show="showSearch" ref="queryParamsRef" :inline="true" :model="queryParams" label-width="80px">
        <el-form-item v-if="!userInfo.orgId">
          <select-org-tree :value="queryParams.orgId" @orgNodeClick="orgNodeClick"/>
        </el-form-item>
        <el-form-item label="流转时间">
          <el-date-picker v-model="dateRange" :unlink-panels="true" end-placeholder="结束日期"
                          range-separator="截止" start-placeholder="开始日期" type="datetimerange"
                          value-format="YYYY-MM-DD HH:mm:ss"></el-date-picker>
        </el-form-item>
        <el-form-item label="流转类型" prop="recordType">
          <el-select v-model="queryParams.recordType" class="width-120" clearable placeholder="请选择流转类型"
                     @change="handleQuery">
            <el-option v-for="dict in dictDataMap['stock_consume_type']" :key="dict.dictValue"
                       :label="dict.dictLabel" :value="dict.dictLabel"/>
          </el-select>
        </el-form-item>
        <el-form-item label="来源类型" prop="sourceType">
          <el-select v-model="queryParams.sourceType" class="width-120" clearable placeholder="请选择来源类型"
                     @change="handleQuery">
            <el-option v-for="dict in dictDataMap['drug_storage_type']" :key="dict.dictValue"
                       :label="dict.dictLabel" :value="dict.dictLabel"/>
          </el-select>
        </el-form-item>
        <el-form-item label="药品名称" prop="drugName">
          <el-input v-model="queryParams.drugName" clearable placeholder="请输入药品名称"
                    @keyup.enter.native="handleQuery"/>
        </el-form-item>
        <el-form-item label="单号" prop="documentNo">
          <el-input v-model="queryParams.documentNo" clearable placeholder="请输入单号"
                    @keyup.enter.native="handleQuery"/>
        </el-form-item>
        <el-form-item label="门诊号" prop="clinicNo">
          <el-input v-model="queryParams.clinicNo" clearable placeholder="请输入门诊号"
                    @keyup.enter.native="handleQuery"/>
        </el-form-item>
        <el-form-item label="住院号" prop="hospitalNo">
          <el-input v-model="queryParams.hospitalNo" clearable placeholder="请输入住院号"
                    @keyup.enter.native="handleQuery"/>
        </el-form-item>
        <el-form-item label="领取科室" prop="applyDeptName">
          <el-input v-model="queryParams.applyDeptName" clearable placeholder="请输入领取科室"
                    @keyup.enter.native="handleQuery"/>
        </el-form-item>
        <el-form-item label="发放科室" prop="recordDeptName">
          <el-input v-model="queryParams.recordDeptName" clearable placeholder="请输入发放科室"
                    @keyup.enter.native="handleQuery"/>
        </el-form-item>
        <el-form-item label="领取人" prop="applyPersonName">
          <el-input v-model="queryParams.applyPersonName" clearable placeholder="请输入领取人"
                    @keyup.enter.native="handleQuery"/>
        </el-form-item>
        <el-form-item label="发放人" prop="recordPersonName">
          <el-input v-model="queryParams.recordPersonName" clearable placeholder="请输入发放人"
                    @keyup.enter.native="handleQuery"/>
        </el-form-item>
        <el-form-item label="领用人(患者)" prop="usePersonName">
          <el-input v-model="queryParams.usePersonName" clearable placeholder="请输入领用人(患者)"
                    @keyup.enter.native="handleQuery"/>
        </el-form-item>
        <div class="mr20" style="float: right">
          <query-form-button @handleQuery="handleQuery" @resetQuery="resetQuery"/>
        </div>
      </el-form>
    </div>
    <el-row :gutter="10" class="mb8" style="margin-right: 158px;">
      <el-col :span="1.5">
        <el-button v-hasPerm="['drug:drugStockAllLog:export']" plain type="warning"
                   @click="handleExport">
          <template #icon>
            <i-ep-download/>
          </template>
          导出
        </el-button>
      </el-col>
    </el-row>

    <el-table v-adaptive :border="true" :data="drugStockAllLogList" :header-cell-style="$headerCellStyle" :stripe="true"
              highlight-current-row @selection-change="handleSelectionChange">
      <el-table-column :align="'center'" type="selection" width="55"/>
      <el-table-column :align="'center'" :show-overflow-tooltip="true" label="门诊号" prop="clinicNo"/>
      <el-table-column :align="'center'" :show-overflow-tooltip="true" label="住院号" prop="hospitalNo"/>
      <el-table-column :align="'center'" :show-overflow-tooltip="true" label="单号" prop="documentNo"
                       width="120px"/>
      <el-table-column :align="'center'" :show-overflow-tooltip="true" label="流转类型" prop="recordType"
                       width="70px">
        <template #default="scope">
          {{ scope.row.recordType }}
          <!--                    <dict-data-tag :options="dictDataMap['stock_consume_type']" :value="scope.row.recordType" />-->
        </template>
      </el-table-column>
      <el-table-column :align="'center'" :show-overflow-tooltip="true" label="来源类型" prop="sourceType"/>
      <!--            <el-table-column :show-overflow-tooltip="true" label="库存id" :align="'center'" prop="stockId"/>-->
      <el-table-column :align="'center'" :show-overflow-tooltip="true" label="药品类别" prop="drugType"/>
      <el-table-column :align="'center'" :show-overflow-tooltip="true" label="药品剂型" prop="drugFrom"/>
      <el-table-column :align="'center'" :show-overflow-tooltip="true" label="药品分类" prop="drugClass"/>
      <el-table-column :align="'left'" :show-overflow-tooltip="true" label="药品名称" min-width="190px" prop="drugName">
        <template #default="scope">
          <span class="fz14 fw-bold">{{ scope.row.drugName }}</span>
        </template>
      </el-table-column>
      <el-table-column :align="'center'" :show-overflow-tooltip="true" label="药品编码" prop="drugCode"
                       width="110px"/>
      <el-table-column :align="'center'" :show-overflow-tooltip="true" label="规格" prop="spec" width="120px"/>
      <el-table-column :align="'center'" :show-overflow-tooltip="true" label="厂商名称" prop="firmName" width="120px"/>
      <!--       <el-table-column :show-overflow-tooltip="true" :align="'center'" label="包装数量" prop="packageNum"/>-->
      <!--      <el-table-column :show-overflow-tooltip="true" label="大小包装" :align="'center'" prop="packSize"/>-->
      <el-table-column :align="'right'" :show-overflow-tooltip="true" label="数量" prop="amount">
        <template #default="scope">
          <!--          <span class="ys-css">{{ scope.row.packSize === '1' ? scope.row.amount : scope.row.amount / scope.row.packageNum}}</span>{{ scope.row.units }}-->
          <span class="ys-css">{{ scope.row.amount }}</span>{{ scope.row.units }}
        </template>
      </el-table-column>
      <!--      <el-table-column :show-overflow-tooltip="true" :align="'left'" label="单位" prop="units"/>-->
      <!--      <el-table-column :align="'center'" :show-overflow-tooltip="true" label="库存变动前数量" prop="currentAmount"-->
      <!--                       width="110"/>-->
      <el-table-column :align="'center'" :show-overflow-tooltip="true" label="单价(元)" prop="itemPrice"/>
      <el-table-column :align="'center'" :show-overflow-tooltip="true" label="进价(元)" prop="tradePrice"/>
      <!-- <el-table-column :show-overflow-tooltip="true" :align="'center'" width="120px" label="网络销售价格" prop="networkPrice" /> -->
      <el-table-column :align="'center'" :show-overflow-tooltip="true" label="总额(元)" prop="costs" width="100px"/>
      <el-table-column :align="'center'" :show-overflow-tooltip="true" label="收费系数" prop="priceQuotiety"/>
      <el-table-column :align="'left'" :show-overflow-tooltip="true" header-align="center" label="领取科室"
                       prop="applyDeptName"/>
      <el-table-column :align="'left'" :show-overflow-tooltip="true" header-align="center" label="领取人"
                       prop="applyPersonName"/>
      <el-table-column :align="'left'" :show-overflow-tooltip="true" header-align="center" label="发放科室"
                       prop="recordDeptName"/>
      <el-table-column :align="'left'" :show-overflow-tooltip="true" header-align="center" label="记录人(发放人)"
                       prop="recordPersonName"
                       width="120px"/>
      <el-table-column :align="'left'" :show-overflow-tooltip="true" header-align="center" label="领用人(患者)"
                       prop="usePersonName"
                       width="120px"/>
      <!--      <el-table-column :show-overflow-tooltip="true" :align="'center'" label="备注" prop="remarks"/>-->
    </el-table>

    <pagination v-show="total > 0" v-model:limit="queryParams.pageSize" v-model:page="queryParams.pageNum"
                :total="total" @pagination="getList"/>
  </div>
</template>

<script lang="ts" setup>
import {selectPageDrugStockAllLog} from "@/api/drug/drugStockAllLog";
import {useUserStoreHook} from "@/store/modules/user";
import {useDictStoreHook} from "@/store/modules/dict";

const useUserStore = useUserStoreHook();
const {proxy} = getCurrentInstance() as any
const dictStore = useDictStoreHook();
const dictDataMap = ref(dictStore.isTypeGetData('stock_consume_type', 'drug_storage_type'))
// 登录用户信息
const userInfo = <UserInfoBusi>useUserStore.user.userInfo
const queryParamsRef = ref()
const dateRange = ref()
// 选中数组
const ids = ref<any>([])
// 非单个禁用
const single = ref(true)
// 非多个禁用
const multiple = ref(true)
// 显示搜索条件
const showSearch = ref(true)
// 总条数
const total = ref(0)
// 药品库存流转记录表格数据
const drugStockAllLogList = ref<any>([])
// 查询参数
const queryParams = ref<any>({
  pageNum: 1,
  pageSize: 10,
  clinicNo: undefined,
  hospitalNo: undefined,
  documentNo: undefined,
  recordType: undefined,
  sourceType: undefined,
  drugInfoId: undefined,
  stockId: undefined,
  drugType: undefined,
  drugFrom: undefined,
  drugClass: undefined,
  drugName: undefined,
  drugCode: undefined,
  sysDrugCode: undefined,
  drugInput: undefined,
  spec: undefined,
  units: undefined,
  firmName: undefined,
  packageNum: undefined,
  priceId: undefined,
  packSize: undefined,
  amount: undefined,
  currentAmount: undefined,
  itemPrice: undefined,
  tradePrice: undefined,
  networkPrice: undefined,
  costs: undefined,
  priceQuotiety: undefined,
  applyDept: undefined,
  applyPerson: undefined,
  recordDept: undefined,
  recordPerson: undefined,
  usePerson: undefined,
  orgId: undefined,
  remarks: undefined
})
if (userInfo.orgId) {
  queryParams.value.orgId = userInfo.orgId
  getList()
}

// 机构树点击事件
function orgNodeClick(data, _e) {
  queryParams.value.orgId = data.orgId
  if (queryParams.value.orgId) {
    getList()
  }
}

function storageIdClick(obj) {
  queryParams.value.stockId = obj.id
  getList();
}

/** 查询药品库存流转记录列表 */
function getList() {
  if (!queryParams.value.orgId) {
    return ElMessage.error(proxy.$OrgIdIsEmpty)
  }
  selectPageDrugStockAllLog(proxy.$addDateRange(queryParams.value, dateRange.value)).then((response: any) => {
    drugStockAllLogList.value = response.rows;
    total.value = response.total;
  });
}

/** 搜索按钮操作 */
function handleQuery() {
  queryParams.value.pageNum = 1;
  getList();
}

/** 重置按钮操作 */
function resetQuery() {
  queryParamsRef.value.resetFields()
  dateRange.value = []
  handleQuery();
}

// 多选框选中数据
function handleSelectionChange(selection) {
  ids.value = selection.map(item => item.id)
  single.value = selection.length !== 1
  multiple.value = !selection.length
}

/** 导出按钮操作 */
function handleExport() {
  // download('drug/drugStockAllLog/export', {
  //     ...queryParams
  // }, `drugStockAllLog_${new Date().getTime()}.xlsx`)
}
</script>
<script lang="ts">
export default {
  name: "DrugStockAllLog"
}
</script>
